/*初始化函数*/
layui.use(['layer','form'],function (){
    // 0.1 根据屏幕大小改内容大小
    if(window.screen.width<=768){
        $("#timeline_list").css("padding","6em 0 10em 0").css("width","100%");
    }
    $.get("/blog/timeLine",function (result){
        if(result.code===200){
            let html_str="";
            $.each(JSON.parse(result.data),function (i,n){
                html_str+='<div class="layui-card"><div class="layui-card-header" style="text-align: center">';
                html_str+='<h2>'+n[0][0].publishDate.substring(0,4)+'年</h2></div>';
                html_str+='<div class="layui-card-body">';
                html_str+='<ul class="layui-timeline">';
                /*对每年的月份进行遍历*/
                $.each(n,function (j,m){
                    html_str+='<li class="layui-timeline-item">';
                    html_str+='<i class="layui-icon layui-timeline-axis">&#xe63f;</i>';
                    html_str+='<div class="layui-timeline-content layui-text">';
                    html_str+='<h3 class="layui-timeline-title">'+m[0].publishDate.substring(5,7)+'月</h3>';
                    html_str+='<p></p><ul>';
                    /*对每个月的每个博客进行遍历*/
                    $.each(m,function (k,l){
                        html_str+='<li>';
                        html_str+='<div class="layui-row">';
                        html_str+='<div class="layui-col-md4 layui-col-sm4">';
                        html_str+='<span>'+l.title+'</span></div>';
                        html_str+='<div class="layui-col-md-offset4 layui-col-md4 layui-col-sm-offset4 layui-col-sm4"><i class="layui-icon layui-icon-date"></i><span>'+l.publishDate+'</span></div></div></li>';
                    })
                    html_str+=' </ul> </div>  </li>';
                })
                html_str+='</ul></div></div>';
            })
            $("#timeline_list").prepend(html_str);
        }else layer.msg(result.msg,{icon:5});
    })
})
